<template>
	<view>
		<!-- <view style="display: flex; justify-content:space-between">
			<u-button type="primary" text="修改信息" @click="tochange"></u-button>
			<u-button type="success" text="用车记录" @click="toapply"></u-button>
		</view> -->
		<flowtool :outid="applyData.Id" flowid="386bc6c1-041b-4006-a15a-a9893538acc7" :outmodalShow="isCreated" :deptid="carDeptId" :outshowbutton="applyData.Status == '进行中' ? true : false " :dataname="carData.CarNo + '使用申请'" :formstate="applyData"></flowtool>
		<u-collapse ref='coll' :value="['1','2']">
			<u-collapse-item name="1" title="信息" icon="order">
				<u-cell-group>
					<u-cell title="车辆名称" :use-label-slot="true">
						<span slot="label" class="cell-label">{{carData.Name}}</span>
					</u-cell>
					<u-cell title="车牌号" :use-label-slot="true">
						<span slot="label" class="cell-label">{{carData.CarNo || " "}}</span>
					</u-cell>
					<u-cell title="申请人" :use-label-slot="true">
						<span slot="label" class="cell-label">{{creatorData.Name || " "}}</span>
					</u-cell>
					<u-cell title="预计用车时间" :use-label-slot="true">
						<span slot="label" class="cell-label">{{applyData.PlanUseTime || " "}}</span> 
					</u-cell>
					<u-cell title="预计归还时间" :use-label-slot="true">
						<span slot="label" class="cell-label">{{applyData.PlanReturnTime || " "}}</span> 
					</u-cell>
					<u-cell title="使用地区" :use-label-slot="true">
						<span slot="label" class="cell-label">{{applyData.Range || " "}}</span> 
					</u-cell>
					<u-cell title="用途" :use-label-slot="true">
						<span slot="label" class="cell-label">{{applyData.Remark || " "}}</span>
					</u-cell>
					<u-cell title="用车时间" :use-label-slot="true">
						<span slot="label" class="cell-label">{{applyData.GetTime || " "}}</span> 
					</u-cell>
					<u-cell title="归还时间" :use-label-slot="true">
						<span slot="label" class="cell-label">{{applyData.ReturnTime || " "}}</span> 
					</u-cell>
					<u-cell title="出发时里程表里程(KM)" :use-label-slot="true">
						<span slot="label" class="cell-label">{{applyData.StartMileage || " "}}</span> 
					</u-cell>
					<u-cell title="归还时里程表里程(KM)" :use-label-slot="true">
						<span slot="label" class="cell-label">{{applyData.EndMileage || " "}}</span> 
					</u-cell>
					<u-cell title="是否加油" :use-label-slot="true">
						<span slot="label" class="cell-label">{{applyData.IsRefuelling ? "是" : "否"}}</span> 
					</u-cell>
					<u-cell title="油费" :use-label-slot="true">
						<span slot="label" class="cell-label">{{applyData.OilFee || " "}}</span> 
					</u-cell>
					<u-cell title="状态" :use-label-slot="true">
						<span slot="label" class="cell-label" :style="{'color': (applyData.Status == '已归还' ? 'green' : 'red' )}">{{applyData.Status || " "}}</span>
					</u-cell>
					
				</u-cell-group>
			</u-collapse-item>
			<u-collapse-item name="2" title="油表与里程表照(出发)" icon="https://project.gxrunxiang.com/cdn/image.png">
				<u-album :urls="imagesurls1"></u-album>
			</u-collapse-item>
			<u-collapse-item name="2" title="油表与里程表照(归还)" icon="https://project.gxrunxiang.com/cdn/image.png">
				<u-album :urls="imagesurls2"></u-album>
			</u-collapse-item>
			<u-collapse-item name="2" title="车位照" icon="https://project.gxrunxiang.com/cdn/image.png">
				<u-album :urls="imagesurls3"></u-album>
			</u-collapse-item>
		<!-- <u-button type="error" :plain="true" v-if="user.Roles.indexOf('管理员角色')!=-1 || user.Roles.indexOf('公司领导角色')!=-1 
		|| user.Roles.indexOf('部门领导角色')!=-1 || user.Roles.indexOf('分公司副总')!=-1 || user.Roles.indexOf('分管领导')!=-1
		|| user.Roles.indexOf('部门内项目部审批人')!=-1"
			@click="delmodalShow = true">删除</u-button> -->
		</u-collapse>
		<u-toast ref="uToast"></u-toast>
		<u-modal :show="delmodalShow" title="提示" content='确认删除?' @confirm="del" :showCancelButton="true"
			confirmText="是" cancelText="否" @cancel="delmodalShow = false" :closeOnClickOverlay="true"
			@close="delmodalShow = false"></u-modal>
	</view>
</template>
<script>
	import {
		baseUrl
	} from '@/common/config.js'
	import flowtool from "../c_flowtool.vue"
	import {
		mapGetters
	} from 'vuex'
	import {
		getcarapply,
		getfilebyoutid,
	} from '@/common/api.js'
	export default {
		components: {
		  flowtool
		},
		data() {
			return {
				applyId: "",
				applyData: [],
				carDeptId: "",
				carData: [],
				creatorData: [],
				imagesurls1: [],
				imagesurls2: [],
				imagesurls3: [],
				modalShow: false,
				delmodalShow: false,
				user: {},
				isCreated: false
			}
		},
		onLoad(option) {
			this.user = JSON.parse(uni.getStorageSync("$userinfo"))
			this.applyId = option.Id
			this.isCreated = option.isCreated
		},
		onShow(){
			this.getlist(this.applyId)
		},
		methods: {
			async getlist(id) {
				let para = {
					Parameters: [],
				}
				para.Parameters.push({
					FieldName: "Id",
					ConditionalType: "Equal",
					FieldValue: id
				})
				await getcarapply(false,para).then(res => {
					this.applyData = res.data[0]
					this.carDeptId = this.applyData.Car.DeptId
					this.carData = res.data[0].Car
					this.creatorData = res.data[0].Creator
					setTimeout(() => {
							this.$refs.coll.init()
						},
						1000)
				})
				this.imagesurls1 = []
				this.imagesurls2 = []
				this.imagesurls3 = []
				getfilebyoutid(this.applyId).then(res => {
					for (var i = 0; i < res.length; i++) {
						if (res[i].MyType == '油表与里程表照(出发)') {
							this.imagesurls1.push(`${baseUrl}/SysFile/download?id=${res[i].Id}`)
						}
						if (res[i].MyType == '油表与里程表照(归还)') {
							this.imagesurls2.push(`${baseUrl}/SysFile/download?id=${res[i].Id}`)
						}
						if (res[i].MyType == '车位照') {
							this.imagesurls3.push(`${baseUrl}/SysFile/download?id=${res[i].Id}`)
						}
					}
					setTimeout(() => {
							this.$refs.coll.init()
						},
						1000)
				})
			},
		}
	}
</script>
<style>
	.cell-label {
		margin-top: 10px;
		font-size: 14px;
		color: #909193;
	}
</style>